<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
        <link rel="stylesheet" href="../css/main.css" />
    <noscript><link rel="stylesheet" href="../css/noscript.css" /></noscript>
</head>
<body>
<div th:replace="common/top">

</div>

<!--<div id="BackLink">-->
<!--    <a href="main">Return to Main Menu</a>-->
<!--    <script type="text/javascript">-->
<!--        $(document).ready(function(){-->
<!--            $("#Catalog").hide().fadeIn();-->
<!--        });-->
<!--    </script>-->
<!--</div>-->

<br>
<br>
<br>

<div id="Catalog">Please confirm the information below and then
    press continue...

    <table>
        <tr>
            <th align="center" colspan="2"><font size="4"><b>Order</b></font>
                <br />
                <font size="3"><b th:text="${#dates.format(order.orderDate,'yyyy-MM-dd HH:mm')}"></b></font>

            </th>
        </tr>

        <tr>
            <th colspan="2">Billing Address</th>
        </tr>
        <tr>
            <td>First name:</td>
            <td th:text="${order.billToFirstName}" ></td>
        </tr>
        <tr>
            <td>Last name:</td>
            <td th:text="${order.billToLastName}" ></td>
        </tr>
        <tr>
            <td>Address 1:</td>
            <td th:text="${order.billAddress1}" ></td>
        </tr>
        <tr>
            <td>Address 2:</td>
            <td th:text="${order.billAddress2}" ></td>
        </tr>
        <tr>
            <td>City:</td>
            <td th:text="${order.billCity}" ></td>
        </tr>
        <tr>
            <td>State:</td>
            <td th:text="${order.billState}" ></td>
        </tr>
        <tr>
            <td>Zip:</td>
            <td th:text="${order.billZip}" ></td>
        </tr>
        <tr>
            <td>Country:</td>
            <td th:text="${order.billCountry}" ></td>
        </tr>
        <tr>
            <th colspan="2">Shipping Address</th>
        </tr>
        <tr>
            <td>First name:</td>
            <td th:text="${order.shipToFirstName}" ></td>
        </tr>
        <tr>
            <td>Last name:</td>
            <td th:text="${order.shipToLastName}" ></td>
        </tr>
        <tr>
            <td>Address 1:</td>
            <td th:text="${order.shipAddress1}" ></td>
        </tr>
        <tr>
            <td>Address 2:</td>
            <td th:text="${order.shipAddress2}" ></td>
        </tr>
        <tr>
            <td>City:</td>
            <td th:text="${order.shipCity}" ></td>
        </tr>
        <tr>
            <td>State:</td>
            <td th:text="${order.shipState}" ></td>
        </tr>
        <tr>
            <td>Zip:</td>
            <td th:text="${order.shipZip}" ></td>
        </tr>
        <tr>
            <td>Country:</td>
            <td th:text="${order.shipCountry}" ></td>
        </tr>

    </table>

    <a th:href="@{/order/viewOrder}"  class="Button" >Confirm</a></div>

<!--<%@ include file="../common/IncludeBottom.jsp"%>-->


    <div th:replace="common/bottom">
    </div>



</body>
</html>